<!-- 因为单项歌曲的结构类似，我们创建一个全局组件 -->
<template>
  <div>
    <van-cell :title="title" :label="label">
      <!-- 使用 right-icon 插槽来自定义右侧图标 -->
      <template #right-icon>
        <van-icon
          size="24"
          name="play-circle-o"
          style="line-height: 46px"
          @click="toPlay"
        />
      </template>
    </van-cell>
  </div>
</template>

<script>
export default {
  props: ["title", "label", "id"],
  methods: {
    toPlay() {
      this.$router.push({
        name: "play",
        query: {
          id: this.id,
        },
      });
    },
  },
};
</script>

<style>
</style>